<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智慧社区后台</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/AdminLTE.min.css">
</head>
<style>
</style>
<body id="body" style="padding-bottom: 90px; background-color: #ECF0F5;">
	<div class="modal-content">
		<div class="modal-body">
			<div class="row">
				<div class="col-md-3">欠费</div>
				<div class="col-md-3" id="year1"></div>
				<div class="col-md-3" id="year2"></div>
				<div class="col-md-3" id="year3"></div>
			</div>
			<div class="row">
				<div class="col-md-3" id="list4"></div>
				<div class="col-md-3" id="list1"></div>
				<div class="col-md-3" id="list2"></div>
				<div class="col-md-3" id="list3"></div>
			</div>
			<div class="row">
				<div class="col-md-3">
					<span>缴费来源：</span> <select class="form-control" id="source">
						<option value="">请选择...</option>
						<option value="支付宝">支付宝</option>
						<option value="微信">微信</option>
						<option value="银行卡">银行卡</option>
						<option value="现金">现金</option>
					</select>
				</div>
			</div>
		</div>
	</div>
</body>
<script src="${pageContext.request.contextPath}/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- layer -->
<script src="${pageContext.request.contextPath}/plugins/layer/2.4/layer.js"></script>
<script src="${pageContext.request.contextPath}/js/date.js"></script>

<script>
	var lock = false;
	var id = "${map['id']}";
	var area = "";
	var c = 0;
	var s2Date = "";
	var wyfPrice = "";
	var remark = "";
	var list4Date = "";

	$(function() {
		$
				.ajax({
					url : "${pageContext.request.contextPath}/selectHousePay",
					type : "post",
					data : {
						id : id
					},
					dataType : "json",
					success : function(map) {
						console.log(map);
						var list1 = map['list1'];
						var list2 = map['list2'];
						var list3 = map['list3'];
						var list4 = map['list4'];
						wyfPrice = map['price'];
						area = map['house'].area;
						var listStr1 = "";
						var listStr2 = "";
						var listStr3 = "";
						var listStr4 = "";
						if (list1 != null) {
							for (var i = 0; i < list1.length; i++) {
								if (list1[i].isPay == "false") {
									listStr1 += "<div class='checkbox'><label> <input type='checkbox' onclick='checkboxClick(this);' id='"
											+ c
											+ "' name='checkboxA' value='"
											+ list1[i].date
											+ "'>"
											+ list1[i].date + "</label></div>";
								}
								if (list1[i].isPay == "true") {
									listStr1 += "<div class='checkbox'><label> <input checked id='"
											+ c
											+ "' onclick='checkboxClick(this);' name='checkboxA' type='checkbox' value='1' disabled='disabled'>"
											+ list1[i].date + "</label></div>";
								}
								c++;
							}
						}
						if (list2 != null) {
							for (var i = 0; i < list2.length; i++) {
								if (list2[i].isPay == "false") {
									listStr2 += "<div class='checkbox'><label> <input type='checkbox' id='"
											+ c
											+ "' name='checkboxA' onclick='checkboxClick(this);' value='"
											+ list2[i].date
											+ "'>"
											+ list2[i].date + "</label></div>";
								}
								if (list2[i].isPay == "true") {
									listStr2 += "<div class='checkbox'><label> <input checked id='"
											+ c
											+ "' name='checkboxA' onclick='checkboxClick(this);' type='checkbox' value='1' disabled='disabled'>"
											+ list2[i].date + "</label></div>";
								}
								c++;
							}
						}
						if (list3 != null) {
							for (var i = 0; i < list3.length; i++) {
								if (list3[i].isPay == "false") {
									listStr3 += "<div class='checkbox'><label> <input type='checkbox' id='"
											+ c
											+ "' name='checkboxA' onclick='checkboxClick(this);' value='"
											+ list3[i].date
											+ "'>"
											+ list3[i].date + "</label></div>";
								}
								if (list3[i].isPay == "true") {
									listStr3 += "<div class='checkbox'><label> <input checked id='"
											+ c
											+ "' name='checkboxA' onclick='checkboxClick(this);' type='checkbox' value='1' disabled='disabled'>"
											+ list3[i].date + "</label></div>";
								}
								c++;
							}
						}
						if (list4 != null) {
							for (var i = 0; i < list4.length; i++) {
								listStr4 += "<div class='checkbox'><label> <input checked type='checkbox' value='"+list4[i].date+"' disabled='disabled'>"
										+ list4[i].date + "</label></div>";
								if (i == 0) {
									list4Date = list4[i].date;
								}
							}
						}
						$("#year1").html(map['year1'] + "待缴");
						$("#year2").html(map['year2'] + "待缴");
						$("#year3").html(map['year3'] + "待缴");
						$("#list1").html(listStr1);
						$("#list2").html(listStr2);
						$("#list3").html(listStr3);
						$("#list4").html(listStr4);
					}
				});
	});

	function insertPay() {
		lock = true;
		var source = $("#source").val();
		var checkboxs = $("input[type='checkbox']");
		if (source == '') {
			layer.alert("请选择缴费来源！");
			lock = false;
			return;
		}
		var num = new Array();
		for (var i = 0; i < checkboxs.length; i++) {
			if (checkboxs[i].checked) {
				if (checkboxs[i].value != '1') {
					num.push(checkboxs[i].value.split("-")[0] + ""
							+ checkboxs[i].value.split("-")[1]);
				}
			}
		}
		if (num.length == 0) {
			layer.alert("请选择缴费时间！");
			lock = false;
			return;
		}
		var arg = accMul(parseInt(num.length), parseFloat(area));
		var price = accMul(parseFloat(arg), parseFloat(wyfPrice));
		layer.confirm("是否确认缴费,缴费金额为" + price.toFixed(2) + "?", function(index) {
			$.ajax({
				url : '${pageContext.request.contextPath}/insertPropertyBill',
				type : "post",
				data : {
					payObjectId : id,
					payProject : "物业费",
					price : price.toFixed(2),
					source : source,
					payMethod : "线下付款",
					remark : remark,
					s2Date : s2Date
				},
				dataType : "json",
				success : function(data) {
					var result = data['result'];
					if (result == 1) {
						layer.msg('操作成功!', {
							icon : 1,
							time : 800
						});
						setTimeout(function() {
							parent.querry();
							parent.layer.close(parent.layer
									.getFrameIndex(window.name));
						}, 1000);
					} else {
						layer.msg('操作失败!', {
							icon : 2,
							time : 800
						});
						lock = false;
					}
				}
			});
		});
		lock = false;
	}

	function checkboxClick(checkbox1) {
		var id = checkbox1.id;
		// 		if (s2Date == '') {
		s2Date = checkbox1.value;
		// 		}
		var checkboxs = $("input[name='checkboxA']");
		for (var i = 0; i < checkboxs.length; i++) {
			if (checkboxs[i].value != '1') {
				checkboxs[i].checked = false;
			}
		}
		var count = 0;
		for (var i = 0; i <= id; i++) {
			if ($("#" + i).val() != '1') {
				$("#" + i).prop("checked", true);
				if (count == 0) {
					if (list4Date == "") {
						remark = "缴物业费,从" + $("#" + i).val() + "到" + s2Date;
					} else {
						remark = "缴物业费,从" + list4Date + "到" + s2Date;
					}
				}
				count++;
			}
		}
	}

	function accMul(arg1, arg2) {
		if (isNaN(arg1)) {
			arg1 = 0;
		}
		if (isNaN(arg2)) {
			arg2 = 0;
		}
		arg1 = Number(arg1);
		arg2 = Number(arg2);

		var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
		try {
			m += s1.split(".")[1].length;
		} catch (e) {
		}
		try {
			m += s2.split(".")[1].length;
		} catch (e) {
		}
		return Number(s1.replace(".", "")) * Number(s2.replace(".", ""))
				/ Math.pow(10, m);
	}

	// 给Number类型增加一个mul方法，调用起来更加方便。
	Number.prototype.mul = function(arg) {
		return accMul(this, arg);
	};

	function insert() {
		if (!lock) {
			insertPay();
		}
	}
</script>
</html>
